<template>
  <!-- 最新评论 -->
  <div class="card-widget card-recent-post">
    <a @click="handleClick" title="查看更多" class="card-more-btn" style="cursor:pointer" draggable="false">
      <i class="haofont hao-icon-chevron-right"></i>
    </a>
    <div class="item-headline">
      <i class="haofont hao-icon-chat--fill" style="font-size: 19px;"></i>
      <span>{{ siteConfig.talkTitle }}</span>
    </div>
    <div class="aside-list" id="newcomm">
      <div class="aside-list-item" v-for="(talk , index) in talkList" :key="index">
        <span></span>
        <a class="thumbnail" href="javascript:void(0);" @click="toPath('article?id=' + talk.id)">
          <img alt="头像" :src="talk.avatar ? talk.avatar : '/src/assets/images/404s.gif'"/>
        </a>
        <div class="content">
          <a class="comment"
             style="display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;"
             href="javascript:void(0);" @click="toPath('article?id=' + talk.id)" :title="talk.content">
            {{ talk.content }}
          </a>
          <div class="name">
            <span>{{ talk.name }}</span>
            <time :datetime="talk.dateTime"></time>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import {computed} from "vue";
import {useRouter} from 'vue-router';
import store from "../../store/index.js";

const router = useRouter();
const siteConfig = computed(() => store.state.data.siteConfig);
const talkList = computed(() => store.state.data.consoleTalkList);

const handleClick = () => {
  console.log("点击了");
}

const toPath = (path) => {
  router.push(path)
}
</script>

<style scoped>
</style>
